﻿$(function() {
	/**
	 * 月度同比
	 * */
	
	var barchart1 = echarts.init(document.getElementById('monthbar1'));
	optionBar1 = {
		    tooltip: {
		        trigger: 'axis',
		        axisPointer: {
		            type: 'shadow'
		        }
		    },
		    backgroundColor:'#e0e0e0',
		    color:['#cc3f44'],
		    grid: {
                top: '15%',
                left: '5%',
                right: '15%',
                bottom:'14%',
                containLabel: true
            },
		    xAxis: {
		        type: 'value',
		        boundaryGap: [0, 0.01],
		        name : '小时',
		        nameLocation:'end',
			        axisLabel : {
	                formatter: '{value}'
	            },
	            splitLine:{
	            	show:false
	            }
		    },
		    yAxis: {
		        type: 'category',
		        name : '月度同比',
		        data:[],
	            splitLine:{
	            	show:false
	            }
		    },
		    series: [{
	            name: '月度同比',
	            type: 'bar',
	            barMaxWidth:60,
	            label: {
	                normal: {
	                    show: true,
	                    formatter: '{c}小时',
	                    position: 'right'
	                }
	            },
	            data:[] 
		    }]
		};
	barchart1.setOption(optionBar1);
	
	//下拉框选项
    $('#cc').combobox({
    	width:'100px',
    	panelHeight:100,
    	valueField: 'value',
		textField: 'label',
		data: [{
			label:'选择月份',
			value:'0'
		},{
			label: '1月',
			value: '1'
		},{
			label: '2月',
			value: '2'
		},{
			label: '3月',
			value: '3'
		},{
			label: '4月',
			value: '4'
		},{
			label: '5月',
			value: '5'
		},{
			label: '6月',
			value: '6'
		},{
			label: '7月',
			value: '7'
		},{
			label: '8月',
			value: '8'
		},{
			label: '9月',
			value: '9'
		},{
			label: '10月',
			value: '10'
		},{
			label: '11月',
			value: '11'
		},{
			label: '12月',
			value: '12'
		}],
		onChange:function(value){
			getSameMonthData();
		}
    });
	
	/**
	 * 月报警时长分析
	 * */
    var barchart2 = echarts.init(document.getElementById('monthbar2'));
    optionBar2 = {
    		tooltip : {
    	        trigger: 'axis',
    	        axisPointer: {
    		        type: 'shadow'
    		    }
    	    },
    	    grid: {
                top: '15%',
                left: '5%',
                right: '5%',
                bottom:'15%',
                containLabel: true
            },
            backgroundColor:'#e0e0e0',
            color:['#ff6264','#cc3f44'],
    	    legend: {
    	    	bottom:25,
    	        data:['每月报警时长(小时)','相对报警(%)']
    	    },
    	    xAxis : [{
    	            type : 'category',
    	            data : [],
    	            splitLine:{
    	            	show:false
    	            }
    	        }],
    	    yAxis : [{
    	    	    min:0,
    	            type : 'value',
    	            name : '每月报警时长(小时)',
    	            axisLabel : {
    	                formatter: '{value}'
    	            },
    	            splitLine:{
    	            	show:false
    	            }
    	        }, {
    	        	min:0,
    	        	max:100,
    	            type : 'value',
    	            name : '相对报警时长(报警时长/工作总时长)',
    	            axisLabel: {
    	            	formatter: '{value}%'
    	            },
    	            splitLine:{
    	            	show:false
    	            }
    	        }],
    	    series : [{
                name:'每月报警时长(小时)',
                barMaxWidth:60,
                type:'bar',
                data:[]
            },{
                name:'相对报警(%)',
                yAxisIndex: 1,
                type:'line',
                data:[]
            }]
    	};
    barchart2.setOption(optionBar2);
    
    
    
    
    var lineId=0;var equId=0;
    var	startMonth=1;
    var	endMonth=1;
    var year=moment().year();
    
    /**
     * slider滑动事件
     * */
    $('#ss').slider({
    	range: true,
    	max:12,
		tipFormatter: function(value){    
        	return "第"+value+"月";
        },
        onComplete:function(value){//滑块值改变时触发
	       	startMonth=value[0];
	       	endMonth=value[1];
	       	getData();
       }
    });
    
    /**
     * 初始化
     * */
    var vm = new Vue({
	    el: '#itemData',
	    data:{item:[]}
	}); 

    var weeks=[1,moment().month()+1];
    $('#ss').slider('setValues',weeks);
    var arr=$('#ss').slider('getValues');
    startMonth=arr[0];
    endMonth=arr[1];
    getData();
    
    function getSameMonthData(){
    	var month=$("#cc").combobox('getValue');
    	$.post(basePath+"/single/singleBySameMonth/powerMonth.json",{"equId":equId,"month":month},function(res){
    		barchart1.setOption({
   			 yAxis: {
			        data:res.listBySameMonthLendge 
			    },
			    series: [{
		            data: res.listBySameMonth
			    }]
    		});
    	});
    }
    function getData(){
    	$("#cc").combobox('setValue', startMonth);
    	$.post(basePath+"/single/singlePower/month.json",{"lineId":lineId,"equId":equId,"year":year,"startTime":startMonth,"endTime":endMonth},function(res){
    		vm.$set('item',res);
    		barchart2.setOption({
    			xAxis: {
		            data: res.listByEachMonthLendge
		        },
		        series : [{
	                name:'每周报警时长(小时)',
	                data:res.listByEachMonth
	            },{
	                name:'相对报警(%)',
	                data:res.listByEachMonthRate
	            }]
    		});
    	});
    }

    
	 //点击事件
	 $("#defineTime").click(function (){
		 var mePanel = $('#defineTimeWin');
	   	 mePanel.dialog('open');
	 });
	//定义时间的表单
	$('#defineTimeWin').dialog({
		title:'自定义时间',
		width:400,
		height:150,
		iconCls:'icon-add',
		closed: true,
		modal: true,
		inline:true,
		buttons:[{
			text:'确定',
			iconCls:'icon-add-new',
			handler:function(){
					var st=$("input[name='startTime']").val();
					year=st;
					getData();
					$('#defineTimeWin').dialog('close');

			}
		},{
			text:'取消',
			iconCls:'icon-redo',
			handler:function(){
				$('#defineTimeWin').dialog('close');
			}
		}],
		onClose: function() {
			$('#defineTimeform').form('reset');
		}
	});
	 /**
	  * 切换设备的点击事件
	  * */
	var mePanel = $('#switchEquip');
	$("#linetree").tree({
		onClick: function(node) {
			if (node.url) {
				lineId=node.id;
				var lineGrid = $('#lines_data');
				lineGrid.datagrid('load',{
					lineId:node.id
				});
				lineGrid.datagrid('getPanel').panel('setTitle',node.text);
			}
		}
	});
	$('#lines_data').datagrid({
		//双击设备时，根据选中设备刷新
		onDblClickRow: function(rowIndex, rowData){
			lineId=rowData.lineId;
			equId=rowData.id;
			var arr=$('#ss').slider('getValues');
		    startMonth=arr[0];
		    endMonth=arr[1];
		    getData();
		    mePanel.dialog('close');
		}
	});
  $("#switchEquipOK").click(function(){
  	var row = $('#lines_data').datagrid('getSelected');
  	if(row){
  		lineId=row.lineId;
  		equId=row.id;
  		var arr=$('#ss').slider('getValues');
  	    startMonth=arr[0];
  	    endMonth=arr[1];
  	    getData();
		$('#switchEquip').dialog('close');
  	}else{
  		$.messager.alert({showSpeed:100,title:'消息提示',msg:'请选择一条设备记录!',timeout:3000});
  	}
  });
    
});